<!DOCTYPE html>
<html lang="en">
<head>
  <title>PuePy Tutorial Examples</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
</head>
<body>
<h1>PuePy Examples</h1>
<p>
  The examples from this directory are intended to be read with the <a href="https://docs.puepy.dev/">PyScript Docs</a>.
  You can tinker with them by running <code>serve_examples.py</code> in the main project folder, but refer to the
  documentation for
  explanations.
</p>
<h1>Simple Tutorial Examples</h1>
<ul>
  <li><a href="tutorial/01_hello_world/index.html">Example 1: Hello, World</a></li>
  <li><a href="tutorial/02_hello_name/index.html">Example 2: Hello, Name</a> (data bind feature)</li>
  <li><a href="tutorial/03_counter/index.html">Example 3: Counter</a> (events)</li>
  <li><a href="tutorial/04_refs_problem/index.html">Example 4: Refs Problem</a> (see <a href="tutorial/04_refs_problem/solution.html">solution</a>) </li>
  <li><a href="tutorial/05_watchers/index.html">Example 5: Watchers</a></li>
  <li><a href="tutorial/06_components/index.html">Example 6: Components</a></li>
  <li><a href="tutorial/07_routing/index.html">Example 7: Routing</a></li>
  <li><a href="tutorial/08_libraries/index.html">Example 8: PyPi Libraries</a></li>
  <li><a href="tutorial/09_webcomponents/index.html">Example 9: WebComponents</a></li>
  <li><a href="tutorial/10_full_app/index.html">Example 10: A full-blown app</a></li>
</ul>
<h1>Integrations</h1>
<ul>
  <li><a href="integrations/11_micropython_datetimes/index.html">Datetimes in MicroPython</a></li>
  <li><a href="integrations/12_ltk/index.html">Using LTK and PuePy</a></li>
  <li><a href="integrations/13_jinja/index.html">Using Jinja2 and PuePy</a></li>
  <li><a href="integrations/14_shoelace_autocomplete/index.html">Auto-Complete with Shoelace.style</a></li>
</ul>
</body>
</html>